<template>
    <Space>
        <el-button type="text" @click="editClick" class="btn">
            <span style="display: flex;">
                <img class="icon" src="@/assets/image/operation/editIcon.png" alt="">
                <span class="edit-txt">编辑</span>
            </span>
        </el-button>
        <el-button type="text" @click="onDeleteClick" class="btn">
            <span style="display: flex;">
                <img class="icon" src="@/assets/image/operation/deleteIcon.png" alt="">
                <span class="delete-txt">删除</span>
            </span>
        </el-button>
    </Space>
</template>
<style lang="scss" scoped>
.btn {
    display: flex;
    align-content: center;
}
.icon {
    width: 14px;
    height: 14px;
    margin-right: 4px;
}
.delete-txt {
    color: #FF4444;
    font-size: 14px;
    line-height: 16px;
    height: 14px;
}
.edit-txt {
    color: #00E0FF;
    font-size: 14px;
    line-height: 16px;
    height: 14px;
}
</style>
<script>
    import FormModal from './FormModal.vue'
    import { deleteAreaCarbonInfo } from '@/api/factorManage'
    export default {
        name: 'Operation',
        props: {
            rowData: {
                type: Object,
                default: () => {
                    return {}
                },
            },
        },
        inject: ['tableRoot'],
        methods: {
            editClick() {
                new this.$pageModal(
                    FormModal,
                    {
                        props: {
                            title: '编辑',
                            rowData: this.$props.rowData,
                        },
                    },
                    (result) => {
                        if (result) {
                            this.tableRoot.onSearchChange()
                        }
                    }
                )
            },
            onDeleteClick() {
                this.$confirm('您确认要删除数据嘛？', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    distinguishCancelAndClose: true,
                    type: 'warning',
                }).then(() => {
                    deleteAreaCarbonInfo(this.rowData.id).then((result) => {
                        if (result.code == 200) {
                            this.$message.success(result.msg)
                            this.tableRoot.onSearchChange()
                        }
                    })
                })
            },
        },
    }
</script>
